﻿@model OnlineEducation.Data.Entities.TeachingPlan
@{
    ViewData["Title"] = "教学计划信息";

    var duration = Model.Course.Lessons.OrderByDescending(n => n.Sequence).Select(n => n.Duration).FirstOrDefault();

    var finalBeginTime = Model.TeachingPlanItems.OrderByDescending(n => n.BeginTime).Select(n => n.BeginTime).FirstOrDefault();

    var endDate = finalBeginTime.AddMinutes(duration);

}

@section Styles{
    <!-- Plugins css -->
    <link href="~/assets/libs/nestable2/jquery.nestable.min.css" rel="stylesheet" />
    <style>
        .course_img {
            width: 100%;
            height: 100%;
        }

        .card-box {
            margin-bottom: 10px;
        }

        .notification {
            border: dashed 1px solid;
            border-radius: 4px;
            background-color: #4fc6e1;
            padding: 10px;
            margin-bottom: 10px;
        }

        .col-8 {
            padding-right: 0;
        }

        .dd {
            max-width: unset;
        }

        .hide {
            display: none;
        }

        .dd-list .dd3-content {
            padding: 8px 0px 8px 0px !important;
        }

        .dd-empty, .dd-item, .dd-placeholder {
            font-size: 10px;
        }
    </style>

}
@functions {

    public string showStatus(int status)
    {
        if (status == 0)
        {
            return "未开始";
        }
        else if (status == 1)
        {
            return "进行中";
        }
        else if (status == 2)
        {
            return "完成";
        }
        else
        {
            return "未知";
        }
    }

    public string getAvatar(OnlineEducation.Data.Entities.ApplicationUser teacher)
    {
        if (string.IsNullOrEmpty(teacher.avatar))
        {
            if (teacher.Gender == 1)
            {
                return "/assets/images/users/default_male.jpg"; ;
            }
            else
            {
                return "/assets/images/users/default_female.jpg";
            }
        }
        else
        {
            return teacher.avatar;
        }
    }

}

<!-- Start Content-->
<div class="container-fluid">
    <!-- start page title -->
    <div class="row">
        <div class="col-12">
            <div class="page-title-box">
                <div class="page-title-right">

                    <ol class="breadcrumb m-0">
                        <li class="breadcrumb-item"><a href="javascript: void(0);"><i class="fa fa-map-marker-alt"></i></a></li>
                        <li class="breadcrumb-item"><a href="javascript: void(0);">教学计划</a></li>
                        <li class="breadcrumb-item active">/</li>
                    </ol>
                </div>
                <h4 class="page-title">教学计划预览</h4>
            </div>
        </div>
    </div>
    <!-- end page title -->
    @if (!string.IsNullOrEmpty(Model.Notification))
    {
        <div class="row">
            <div class="col-12">
                <div class="notification">课程公告</div>
            </div>
        </div>
    }
    <div class="card-box">
        <div class="row">

            <div class="col-md-6 col-xl-6 col-xs-12 col-sm-12">
                @{
                    var url = @Model.Course.CoverPictureURL;

                    if (string.IsNullOrEmpty(url))
                    {
                        url = "/assets/images/no-image-available.png";
                    }
                }
                <img src="@url" class="course_img" />
            </div>
            <input type="hidden" value="@Model.Id" id="teachingplanid" />
            <div class="col-md-6 col-xl-6 col-xs-12 col-sm-12">
                <h4 class="title">@Model.Course.Title</h4>
                <p class="subtitle">@Model.Course.SubTitle</p>
                <p class="price">价格: ￥@Model.Course.Price</p>
                <p class="status">状态: @showStatus(Model.Status)</p>
                <p class="teaching_peroid">授课时间: @Model.BeginTime.ToString("yyyy-MM-dd") - @endDate.ToString("yyyy-MM-dd")</p>

            </div>

        </div>
    </div>

    <div class="row">

        <div class="col-md-8 col-xl-8 col-xs-12 col-sm-12">
            <div class="card-box">
                <ul class="nav nav-tabs nav-bordered">
                    <li class="nav-item">
                        <a href="#course-intro" data-toggle="tab" aria-expanded="false" class="nav-link active">
                            课程介绍
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="#course-eval" data-toggle="tab" aria-expanded="true" class="nav-link">
                            课程评价(@Model.Evaluations.Count())
                        </a>
                    </li>

                </ul>
                <div class="tab-content">
                    <div class="tab-pane show active" id="course-intro">
                        <p>@Html.Raw(Model.Course.Description)</p>
                    </div>
                    <div class="tab-pane" id="course-eval">
                        @foreach (var comment in Model.Evaluations)
                        {
                            <div class="panel panel-default">
                                <div class="panel-body">
                                    <div class="media" id="comment-@comment.Id">
                                        <div class="media-left">
                                            <img class="media-object img-author-logo img-author-logo-sm" src="~/images/user_unknown.png" alt="User Avatar">
                                        </div><!-- /.media-left -->
                                        <div class="media-body">
                                            <h5 class="media-heading">
                                                <strong>@comment.CreatedBy</strong>
                                                <span class="text-muted font-small">@DateHelper.ToPrettyDate(comment.CreatedTime)</span>

                                            </h5>
                                            <p>
                                                @comment.Content
                                            </p>
                                        </div><!-- /.media-body -->
                                    </div><!-- /.media -->
                                </div><!-- /.panel-body -->


                            </div><!-- /.panel -->
                        }
                        <div class="pull-right">
                        </div>
                        <div class="clearfix"></div>
                        <hr>

                    </div>

                </div>
            </div>
            <div class="card-box">
                <ul class="nav nav-tabs nav-bordered">
                    <li class="nav-item">
                        <a href="#home-b3" data-toggle="tab" aria-expanded="true" class="nav-link active">
                            课时信息
                        </a>
                    </li>

                </ul>
                <div class="tab-content">
                    <div class="tab-pane show active" id="lesson">
                        <div class="custom-dd-empty dd" id="nestable_list_lesson">
                            <ol class="dd-list">

                                @foreach (var chapters in Model.TeachingPlanItems.Select(n => n.Lesson).GroupBy(n => n.Chapter))
                                {
                                    <li class="dd-item dd3-item" data-id="@chapters.Key">

                                        <div class="dd3-content">
                                            第 @chapters.Key 章
                                        </div>
                                        <ol class="dd-list">

                                            @foreach (var sec in chapters)
                                            {

                                                var teachingitem = Model.TeachingPlanItems.Where(n => n.LessonId == sec.Id).FirstOrDefault();

                                                var beginTime = teachingitem?.BeginTime;

                                                var status = teachingitem?.Status;

                                                <li class="dd-item dd3-item " data-id="@sec.Section">
                                                    <div class="dd-handle dd3-handle"></div>
                                                    <div class="dd3-content">
                                                        <div class="row">
                                                            <div class="col-2 d-none d-sm-block">
                                                                第 @sec.Section 节
                                                            </div>
                                                            <div class="col-md-3 col-xl-3 col-xs-12">
                                                                @sec.Title
                                                            </div>
                                                            <div class="col-3 d-none d-sm-block">
                                                                开始时间：@beginTime.Value.ToString("yyyy-MM-dd HH:mm")
                                                            </div>
                                                            <div class="col-2 d-none d-sm-block">
                                                                时长 @sec.Duration 分钟
                                                            </div>
                                                            <div class="col-2 d-none d-sm-block">
                                                                @showStatus(status.Value)
                                                            </div>
                                                        </div>
                                                    </div>
                                                </li>
                                            }

                                        </ol>
                                    </li>
                                }
                            </ol>
                        </div>
                    </div>


                </div>
            </div>
        </div>
        <div class="col-md-4 col-xl-4 col-xs-12 col-sm-12">

            <div class="card-box">
                <ul class="nav nav-tabs nav-bordered">
                    <li class="nav-item">
                        <a href="#home-b3" data-toggle="tab" aria-expanded="true" class="nav-link active">
                            授课教师
                        </a>
                    </li>

                </ul>
                <div class="tab-content">
                    <div class="media mb-3">

                        <img class="d-flex mr-3 mt-2 rounded-circle avatar-lg" src="@getAvatar(Model.Teacher)" alt="Generic placeholder image">
                        <div class="media-body">
                            <h4 class="mt-0 mb-1">@Model.Teacher.FullName</h4>
                            <p class="text-muted">@Model.Teacher.Title</p>
                            <p class="text-muted"><i class="mdi mdi-feather"></i> @Model.Teacher.Signature </p>

                            <a href="javascript: void(0);" class="btn- btn-xs btn-info"><i class="mdi mdi-email-outline"></i> 发邮件</a>
                            <a href="javascript: void(0);" class="btn- btn-xs btn-secondary"><i class="mdi mdi-heart-outline"></i> 收藏</a>

                        </div>
                    </div>

                    <h5 class="mb-3 mt-4 text-uppercase bg-light p-2"><i class="mdi mdi-account-circle mr-1"></i> 个人信息</h5>
                    <div class="">
                        <h4 class="font-13 text-muted text-uppercase">简介 :</h4>
                        <p class="mb-3">
                            @Model.Teacher.Intro
                        </p>

                        <h4 class="font-13 text-muted text-uppercase mb-1">生日 :</h4>
                        <p class="mb-3">@Model.Teacher.BirthDate</p>



                        <h4 class="font-13 text-muted text-uppercase mb-1">地址 :</h4>
                        <p class="mb-3"> @Model.Teacher.Address</p>

                        <h4 class="font-13 text-muted text-uppercase mb-1">QQ :</h4>
                        <p class="mb-3"> @Model.Teacher.QQ</p>

                        <h4 class="font-13 text-muted text-uppercase mb-1">Wechat :</h4>
                        <p class="mb-3"> @Model.Teacher.WeChat</p>

                        <h4 class="font-13 text-muted text-uppercase mb-1">Weibo :</h4>
                        <p class="mb-3"> @Model.Teacher.Weibo</p>

                        <h4 class="font-13 text-muted text-uppercase mb-1">最后更新 :</h4>
                        <p class="mb-0"> @Model.Teacher.CreatedTime</p>

                    </div>

                </div> <!-- end card-box-->

            </div>
        </div>
    </div>

    <!-- end row -->

</div>
<div id="modalDefault" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
    <div class="modal-dialog">
        <div class="modal-content">

        </div>
    </div>
</div><!-- /.modal -->
@section Scripts{
    @await Html.PartialAsync("_ValidationScriptsPartial")

    <script src="~/assets/libs/moment/moment.min.js"></script>

    <!-- Plugins js-->
    <script src="~/assets/libs/nestable2/jquery.nestable.min.js"></script>
    <script>



        var table;

        $(function () {

            $("#nestable_list_lesson").nestable();

            $("#btnbooking").click(function () {

                $.ajax({
                    type: 'POST',
                    url: '/Booking/Add',
                    data: 'id=' + $("#teachingplanid").val(),
                    //contentType: 'application/json',
                    success: function (data) {
                        if (data.success) {

                            ShowMessage(data.message);
                            setTimeout(function () {
                                window.location.href = "/Home/Index";
                            }, 2000);

                        } else {
                            ShowMessageError(data.message);
                        }
                    }
                });


            })
        });





        function SubmitForm(form, url) {
            $(form).removeData('validator');
            $(form).removeData('unobtrusiveValidation');
            $.validator.unobtrusive.parse(form);
            if ($(form).valid()) {
                var data = $(form).serializeJSON();
                data = JSON.stringify(data);



            }
            return false;
        }

        function Remove(id) {


            Swal.fire({
                title: "删除",
                text: "确定删除?",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#dd4b39",
                confirmButtonText: "是的，删除!",
                cancelButtonText: "取消",

            }).then(function () {
                $.ajax({
                    type: 'POST',
                    url: '/Course/Delete/' + id,
                    success: function (data) {
                        if (data.success) {
                            ShowMessage(data.message);
                            setTimeout(function () {
                                window.location.href = "/Course/Index";
                            }, 2000);
                        } else {
                            ShowMessageError(data.message);
                        }
                    }
                });
            });


        }

        function UpdateStatus(id) {

            $.ajax({
                type: 'POST',
                url: '/Course/ChangeStatus/' + id,
                success: function (data) {
                    if (data.success) {
                        ShowMessage(data.message);
                        setTimeout(function () {
                            window.location.href = "/Course/Index";
                        }, 2000);
                    } else {
                        ShowMessageError(data.message);
                    }
                }
            });



        }
    </script>
}
